<template>
  <el-dialog
    v-dialogDrag

    :visible.sync="showDetail"
    :append-to-body="true"
    :close-on-click-modal="false"
    :show-close="true"
    :before-close="close"
    title="客户详情"
    width="80%"
  >
    <div class="detailForm">
      <el-collapse v-model="collapseModel">
        <el-collapse-item title="基础信息" name="1">
          <el-form
            ref="detailForm"
            :model="entity"
            :disabled="true"
            label-width="90px"
          >
            <el-row :gutter="8">
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="customer_name" label="客户名称">
                  <el-input
                    v-model="entity.customer_name"
                    placeholder="客户名称"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="phone" label="电话">
                  <el-input
                    v-model="entity.phone"
                    placeholder="电话"
                    clearable
                  />
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="is_try" label="是否试驾">
                  <r-select v-model="entity.is_try" type="1004"/>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="is_order" label="是否下单">
                  <r-select v-model="entity.is_order" type="1004"/>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="retain_cust_type" label="留资类型">
                  <r-select v-model="entity.retain_cust_type" type="2301"/>
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="created_at" label="注册时间">
                  <el-input
                    v-model="entity.created_at"
                    placeholder="注册时间"
                    clearable
                  />
                </el-form-item>
              </el-col>

              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="last_browse_date" label="最新浏览时间">
                  <el-input
                    v-model="entity.last_browse_date"
                    placeholder="最新浏览时间"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="browse_num" label="浏览次数">
                  <el-input
                    v-model="entity.browse_num"
                    placeholder="浏览次数"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="share_num" label="分享次数">
                  <el-input
                    v-model="entity.share_num"
                    placeholder="分享次数"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="last_try_drive_date" label="最新试驾时间">
                  <el-input
                    v-model="entity.last_try_drive_date"
                    placeholder="最新试驾时间"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="8" :md="6">
                <el-form-item prop="last_try_series_name" label="最新试驾车系">
                  <el-input
                    v-model="entity.last_try_series_name"
                    placeholder="最新试驾车系"
                    clearable
                  />
                </el-form-item>
              </el-col>

            </el-row>
          </el-form>
        </el-collapse-item>
        <el-collapse-item title="浏览信息" name="2">
          <detailBrowe :user_id="entity.user_id"/>
        </el-collapse-item>
        <el-collapse-item title="分享信息" name="3">
          <detailShare :user_id="entity.user_id"/>

        </el-collapse-item>
        <el-collapse-item title="预约试驾" name="4">
          <detailTry :user_id="entity.user_id"/>

        </el-collapse-item>
      </el-collapse>

    </div>

    <div slot="footer" style="text-align:center" class="dialog-footer">
      <el-button type="text"><i class="el-icon-search magnifier"/></el-button>
      <el-button @click="close">取 消</el-button>
    </div>

  </el-dialog>
</template>

<script>
import formMixins from '@/mixins/formMixins'
import { mapGetters } from 'vuex'
import filtercode from '@/components/Checkbox/filtercode'
import rSelect from '@/components/Select/Select'
import detailBrowe from './detailBrowe'
import detailShare from './detailShare'
import detailTry from './detailTry'

export default {
  components: {
    rSelect,
    detailBrowe,
    detailShare,
    detailTry,
    filtercode
  },
  mixins: [formMixins],
  props: {

    showDetail: {
      type: Boolean,
      default: false
    },
    entity: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      collapseModel: ['1', '2', '3', '4']
    }
  },
  computed: {
    ...mapGetters(['dictMap', 'regionMap'])
  },
  // 初始化
  mounted() {
  },

  methods: {
    close() {
      this.$emit('update:showDetail', false)
      // if (this.$refs['detailForm']) {
      //   // this.$refs['detailForm'].resetFields()
      //   this.$parent.entityHandle()
      // }
    }
  }
}
</script>

<style scoped>
  .new-order-wrapper {
    padding: 10px 20px;
  }

  .new-order-wrapper .el-step__title {
    font-size: 14px;
  }

  .row-line {
    width: 100%;
  }

  .bm-view {
    width: 100%;
    height: 300px;
  }

  .redItem .el-form-item__label {
    color: indianred;
  }
</style>
